JSCRangeSlider

Note: please use the abstraction layer GUI.rangeSlider if possible! (see GUI)

A range slider is like a normal slider but instead of a fixed-size knob, the knob has a variable extent. The value of the range slider is represented by a 'lo' and a 'hi' component, both being normalized to range 0 ... 1 which corresponds to maximally left / bottom and maximally right / top.

(
    var win;

    win = JSCWindow( "JSCRangeSlider", Rect( 100, 100, 200, 200 ), resizable: false );

    n = JSCRangeSlider( win, Rect( 20, 20, 160, 17 )).lo_( 0 ).hi_( 0.6666 );
    // knobColor_ sets the colour of the slider's knob
    n.knobColor_( Color.red );
    n = JSCRangeSlider( win, Rect( 20, 45, 160, 17 )).lo_( 0.3333 ).hi_( 0.8333 );
    n.knobColor_( Color.white );
    n = JSCRangeSlider( win, Rect( 20, 70, 160, 17 )).lo_( 0.6666 ).hi_( 1.0 );
    n.knobColor_( Color.blue );
    
    win.front;
)

// action_ assigns a function that is executed whenever the user adjusts the slider.
// note: 'n' holds to bottom-most (blue) slider
n.action = { arg b; ("lo = "++b.lo++"; range = "++b.range).postln };
// enabled_ can be used to disable or re-enable editing
n.enabled_( false );
n.enabled_( true );
// lo_, hi_ and range_ programmatically adjust the lo and hi value of the slider
n.lo_( 0.36 );
n.range_( 0.4 );
// the activeXYZ-methods additionally invoke the action function
n.activeHi_( 0.8 );
// using step_ the slider values are snapped to a grid
n.step_( 0.25 );
// a step value of 0 means 'no grid'
n.step_( 0 );

Like JSCSlider, the range slider automatically appears with horizontal or vertical orientation, according to the width-to-height ratio:

n.bounds = n.bounds.resizeTo( 17, 100 );

default keyboard mappings